<script setup>
import { reactive, toRefs } from "vue";
import { geMsgNoticeAPi } from "../../http/http";
import MyDatails from "../../components/MyDatails.vue";
import { useRouter } from "vue-router";
const { push } = useRouter();
const data = reactive({
  tel: "",
  checked: false,
});
// 获取电话号码
const Fntel = () => {
  const { mobile } = JSON.parse(localStorage.getItem("token"));
  data.tel = mobile;
};
const toReplaceTel = () => {
  push({ name: "ReplaceTel", params: { mobile: data.tel } });
};
Fntel();
// 上课短信通知
// 点击切换状态
const switchFlg = async (e) => {
  let checked = data.checked == true ? 0 : 1;
  let res = await geMsgNoticeAPi(checked);
  console.log(res);

  data.checked = res.data.is_msg_notice == 0 ? true : false;
};
// 点击退出
const outLogin = () => {
  localStorage.removeItem("token");
  push("/login");
};
// 点击设置密码
const setPassword = () => {
  push({
    path: "/setPassword",
    query: { id: true },
  });
};

const { tel, checked } = toRefs(data);
</script>
<template>
  <div class="setup">
    <MyDatails>
      <template #left>
        <van-icon name="arrow-left" @click="$router.back" />
      </template>
      <template #text>
        <h3>设置</h3>
      </template>
    </MyDatails>
    <div class="settel">
      <van-cell
        title="跟换绑定手机号"
        is-link
        :value="tel"
        @click="toReplaceTel"
      />
      <van-cell title="设置密码" is-link @click="setPassword" />
      <van-cell title="关于我们" is-link />
      <van-cell title="上课短信通知"
        ><van-switch
          v-model="checked"
          @change="switchFlg"
          active-color="#f15a24"
          inactive-color="#dcdee0"
      /></van-cell>
    </div>
    <van-button
      type="primary"
      style="width: 95%; margin: auto; margin-top: 50px"
      color="#f15a24"
      plain
      block
      @click="outLogin"
      >退出登录</van-button
    >
  </div>
</template>


<style lang="scss" scoped>
</style>